<!--
 * @Author: your name
 * @Date: 2020-12-28 17:49:40
 * @LastEditTime: 2020-12-31 16:17:26
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \basicvue\index.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vue</title>
    <link rel="stylesheet" href="../assets/css/common.css">
    <style>
        #app h1{
            color: #2ecc71;
            padding: 5px;
            border-bottom: 2px solid #ecf0f1;
        }
        #app ul{
            list-style-type: none;
            position: relative;
        }
        #app ul>li{
            width: 500px;
            height: 50px;
            margin: 20px 0;
            background: #7f8c8d;
            border-radius: 50px;
            cursor: pointer;
            /* box-shadow: 5px 5px 10px #dddddd; */
            line-height: 50px;
            text-indent: 5px;
        }
        #app ul>li:hover{
            background: #1abc9c;
        }
        #app ul>li a{
            display: inline-block;
            width: 500px;
            text-decoration: none;
            font-weight: bold;
            font-size: 1.2em;
            color: #ffffff;
        }
        #app>a:first-child{
            width: 180px;
            height: 30px;
            display: inline-block;
            color:#ffffff;
            text-decoration: none;
            background-color:#7f8c8d;
            text-align: center;
            line-height: 30px;
            font-size: 18px;
            font-weight: bold;
            position: absolute;
            left: 80%;
            border-radius: 5px;
        }
        #app>a:first-child:hover{
            background: #1abc9c;
        }
    </style>
</head>
<body>
    <div id="app">
        <a class="" href="https://vuejs.bootcss.com/api/" target="_blank">LH_VUE开发手册</a>
        <h1>vue第一季学习</h1>
        <ul>
            <li><a href="./vuehtml/vueindex.html">(1)：v-if & v-else & v-show</a></li>
            <li><a href="./vuehtml/v-for.html">(2)：v-for</a></li>
            <li><a href="./vuehtml/v-text.html">(3)：v-text & v-html</a></li>
            <li><a href="./vuehtml/v-on.html">(4)：v-on</a></li>
            <li><a href="./vuehtml/v-model.html">(5)：v-model</a></li>
            <li><a href="./vuehtml/v-bind.html">(6)：v-bind</a></li>
            <li><a href="./vuehtml/v-other.html">(7)：其他内部指令,v-pre&v-cloak&v-once</a></li>
        </ul>
        <h1>vue第二季学习</h1>
        <ul>
            <li><a href="./vuehtml/v-directive.html">(1)：Vue.directive自定义指令</a></li>
            <li><a href="./vuehtml/v-extend.html">(2)：Vue.extend构造器的延伸</a></li>
            <li><a href="./vuehtml/v-set.html">(3)：Vue.set全局操作</a></li>
            <li><a href="./vuehtml/v-gou.html">(4)：Vue的生命周期(钩子函数)</a></li>
            <li><a href="./vuehtml/v-template.html">(5)：Template制作模板</a></li>
            <li><a href="./vuehtml/v-component.html">(6)：Component初始组件</a></li>
            <li><a href="./vuehtml/v-prpos.html">(7)：Component组件props属性设置</a></li>
            <li><a href="./vuehtml/v-fuzi.html">(8)：Component父子组件关系</a></li>
            <li><a href="./vuehtml/v-componentBq.html">(8)：Component标签</a></li>
        </ul>
        <h1>vue第三季学习</h1>
        <ul>
            <li><a href="./vuehtml/v-props_extend.html">(1)：propsData Options全局扩展数据传递</a></li>
            <li><a href="./vuehtml/v-computed.html">(2)：computed option 计算属性</a></li>
            <li><a href="./vuehtml/v-methods.html">(3)：Methods Option 方法</a></li>
            <li><a href="./vuehtml/v-watch.html">(4)：watch选项，监控数据</a></li>
            <li><a href="./vuehtml/v-mixins.html">(5)：Mixins 混入选项操作</a></li>
            <li><a href="./vuehtml/v-extends.html">(6)：Extends Option 扩展选项</a></li>
        </ul>
        <h1>vue第四季学习</h1>
        <ul>
            <li><a href="./vuehtml/v-shili.html">(1)：实例入门,实例属性</a></li>
            <li><a href="./vuehtml/v-shilifun.html">(2)：实例方法</a></li>
            <li><a href="./vuehtml/v-shili1.html">(3)：实例方法1</a></li>
            <li><a href="./vuehtml/v-slot.html">(4)：内置组件 -slot讲解</a></li>
        </ul>
    </div>
</body>
</html>